<template>
  <div class="page">
    <div id="YmyThree3"></div>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },
  mounted() {
    this.dataAnalysis();
  },
  methods: {
    // 各区县得分排名分析展示
    dataAnalysis() {
      var YmyThree3 = this.$echarts.init(document.getElementById("YmyThree3"));
      YmyThree3.setOption({
        legend: {},
        tooltip: {
          trigger: "item",
          formatter: "{a} <br/>{b} : {c} ({d}%)",
        },
        dataset: {
          dimensions: ["product", "市级", "区县", "西咸", "开发区"],

          source: [
            {
              product: "大力发展三个经济",
              市级: 43.3,
              区县: 85.8,
              西咸: 93.7,
              开发区: 92,
            },
            {
              product: "全力迎接十四运",
              市级: 83.1,
              区县: 73.4,
              西咸: 55.1,
              开发区: 92,
            },
            {
              product: "建设教育强市",
              市级: 86.4,
              区县: 65.2,
              西咸: 82.5,
              开发区: 92,
            },
            {
              product: "大力发展三个经济2",
              市级: 72.4,
              区县: 53.9,
              西咸: 39.1,
              开发区: 92,
            },
          ],
        },
        xAxis: [
          {
            type: "category",
            //data: ['2015-2016', '2016-2017', '2017-2018', '2018-2019']
            axisLabel: {
              interval: 0, //强制文字产生间隔
              rotate: 45, //文字逆时针旋转45°
              textStyle: {
                //文字样式
                color: "black",
                fontSize: 12,
                fontFamily: "Microsoft YaHei",
              },
            },
          },
        ],
        yAxis: {},
        series: [
          { type: "bar", barWidth: 10 },
          { type: "bar", barWidth: 10 },
          { type: "bar", barWidth: 10 },
          { type: "bar", barWidth: 10 },
        ],
      });
    },
  },
};
</script>
<style lang="less" scoped>
.page {
  width: 100%;
  height: auto;
  padding-top: 40px;
  > div {
    width: 100%;
    height: 440px;
    margin-bottom: 20px;
  }
}
</style>
